<template>
  <div>
    <router-link to="/home" tag="a">
      <span class="iconfont icon-zhuye"></span>
      <p>首页</p>
    </router-link>
    <router-link to="/sort" tag="a">
      <span class="iconfont icon-fenlei"></span>
      <p>分类</p>
    </router-link>
    <router-link to="/cart" tag="a">
      <span class="iconfont icon-gouwuche"></span>
      <p>购物车</p>
    </router-link>
    <router-link to="/mine" tag="a" v-if="is_login">
      <span class="iconfont icon-shouye"></span>
      <p>我的</p>
    </router-link>
    <router-link to="/login" tag="a" v-else>
      <span class="iconfont icon-shouye"></span>
      <p>未登录</p>
    </router-link>
  </div>
</template>

<script>
export default {
  // name: '我的Footer',

  data() {
    return {};
  },

  mounted() {},

  methods: {},
  computed: {
    is_login(){
      if(localStorage.getItem("token")){
        return true
      }else{
        return false
      }
    }
  }
};
</script>

<style  scoped>
div{
    height: .60rem;
    display: flex;
    justify-content: space-around;
    align-items: center;
    background-color: #eee;
}
a{
    color: black; 
    display: flex;
    flex-direction: column;
    align-items: center;
}
a span{
    font-size: .20rem;
}
div a.router-link-exact-active {
  color: lightcoral;
}

</style>